<template>
  <div class='home-menu'>
    <Notice />
    <ul>
      <li v-for="(item,index) in data" :key="index">
        <p class="title"><span>{{item.title}}</span></p>
        <div class="home-item">
          <div v-for="img in item.children" @click.stop.prevent="routerTo(img)" class="active">
            <img :src="img.logo" alt="">
            <p>{{img.label}}</p>
          </div>
        </div>
      </li>
    </ul>
  </div>
</template>
<script>
import Notice from './notice.vue' 
export default {
  components: {Notice},
  name: "",
  data() {
    return {
      data:[
        {
          title:"考勤管理",
          children:[
            {
              label:"发起签到",
              logo:require('../../assets/images/home/menu/icon-11.png'),
              url:"/attendance/sign"
            },{
              label:"请假审批",
              logo:require('../../assets/images/home/menu/icon-12.png'),
              url:"/attendance/level"
            },{
              label:"我的签到记录",
              logo:require('../../assets/images/home/menu/icon-13.png'),
              url:"/attendance/mysign"
            },{
              label:"学生考勤评定",
              logo:require('../../assets/images/home/menu/icon-14.png'),
              url:"/attendance/evaluate"
            }
          ]
        },{
          title:"统一工作流",
          children:[
            {
              label:"审批",
              logo:require('../../assets/images/home/menu/icon-16.png'),
              url:"/workflow/approval"
            },{
              label:"录入",
              logo:require('../../assets/images/home/menu/icon-17.png'),
              url:"/workflow/input"
            },{
              label:"会议记录",
              logo:require('../../assets/images/home/menu/icon-18.png'),
              url:"/workflow/records"
            },{
              label:"学生考核",
              logo:require('../../assets/images/home/menu/icon-19.png'),
              url:"/workflow/student"
            },{
              label:"监考信息",
              logo:require('../../assets/images/home/menu/icon-20.png'),
              url:"/workflow/invigilate"
            },{
              label:"教学工作量",
              logo:require('../../assets/images/home/menu/icon-20-1.png'),
              url:"/workflow/teaching"
            }
          ]
        },{
          title:"学习服务",
          children:[
            {
              label:"科研赛事",
              logo:require('../../assets/images/home/menu/icon-21.png'),
              url:"/studyServe/research/notice"
            },{
              label:"问卷调研",
              logo:require('../../assets/images/home/menu/icon-22.png'),
              url:"/studyServe/question"
            },{
              label:"学习考试",
              logo:require('../../assets/images/home/menu/icon-23.png'),
              url:"/studyServe/exam"
            },{
              label:"讲座报告",
              logo:require('../../assets/images/home/menu/icon-24.png'),
              url:"/studyServe/lecture"
            }
          ]
        },{
          title:"就业服务",
          children:[
            {
              label:"企业校友",
              logo:require('../../assets/images/home/menu/icon-31.png'),
              url:"/jobServe/alumni/industry"
            },{
              label:"高校宣讲",
              logo:require('../../assets/images/home/menu/icon-32.png'),
              url:"/jobServe/preach"
            },{
              label:"招聘信息",
              logo:require('../../assets/images/home/menu/icon-33.png'),
              url:"/jobServe/recruit"
            },{
              label:"勤工助学",
              logo:require('../../assets/images/home/menu/icon-34.png'),
              url:"/jobServe/workstudy"
            },
          ]
        },{
          title:"生活服务",
          children:[
            {
              label:"意见征集",
              logo:require('../../assets/images/home/menu/icon-41.png'),
              url:"/lifeServe/opinions"
            },{
              label:"资助申请",
              logo:require('../../assets/images/home/menu/icon-42.png'),
              url:"/lifeServe/support"
            },{
              label:"评比评选",
              logo:require('../../assets/images/home/menu/icon-43.png'),
              url:"/lifeServe/rating"
            },{
              label:"校园电话",
              logo:require('../../assets/images/home/menu/icon-44.png'),
              url:"/lifeServe/phone"
            },{
              label:"学期校历",
              logo:require('../../assets/images/home/menu/icon-45.png'),
              url:"/lifeServe/calendar"
            },{
              label:"校车时刻",
              logo:require('../../assets/images/home/menu/icon-46.png'),
              url:"/lifeServe/schoolbus"
            },{
              label:"火车站路线",
              logo:require('../../assets/images/home/menu/icon-47.png'),
              url:"/lifeServe/subway"
            },{
              label:"教师邮箱",
              logo:require('../../assets/images/home/menu/icon-48.png'),
              url:"/lifeServe/email"
            },
          ]
        }
      ]
    };
  },
  methods: {
    routerTo(item){
      if(!item.url){
        _g.toMessage({error:2,msg:"功能升级中..."})
        return
      }
      this.$router.push(item.url)
    }
  },
  created() {}
};
</script>
<style lang="scss" scoped>
.home-menu {
  background-color: #efeff4;
  height: calc(100% - 90px);
  overflow-y: auto;

  >ul{
    padding-bottom: 20px;
  }

  li{
    margin:20px 0;
    padding:20px 0;
    background-color: #fff;
  }

  .title{
    font-size: 14px;
    height: 50px;
    line-height: 50px;

    >span{
      margin-left: 10px;
      padding-left: 5px;
      border-left: 3px solid #0076ff;
    }
  }
  .home-item{
    display: flex;
    flex-wrap: wrap;
    padding: 0 20px;

    >div{
      width: 25%;
      text-align: center;
      padding: 20px 0 10px;
      
    }
    img{
      width: 70px;
      height: 70px;
      margin: 0 auto;
      margin-bottom: 10px;
    }
    p{
      font-size: 12px;
    }
  }
}
</style>